@charset "UTF-8";
.header-wrap {
  width: 100%;
  background-color: #fff;
  height: 170px;
  ul {
	padding: 0;
  }
  .top-line {
	width: 100%;
	border-top: 30px solid $gray-base;
	border-bottom: 10px solid $hr-bg;
  }
  .logo {
	float: left;
	height: 50px;
	width: 404px;
	margin-top: 38px;
  }
  .menu-wrap {
	float: right;
	width: 660px;
    text-align: right;
	li {
	  display: inline-block;
	}
  }
}

.menu-item1, .menu-item2, .menu-item3, .menu-item4, .menu-item5, .menu-item6, .menu-item7 {
  display: inline-block;
  width: 89px;
  height: 120px;
  line-height: 120px;
  text-align: center;
  background: url("../images/menu_item.png") no-repeat 0 0;
  text-indent: -9999px;
}

.menu-item1 {
  background-position: 0 0;
  &:hover, &.actived {
	background-position: -9px -122px;
  }
}

.menu-item2 {
  background-position: -112px 0;
  &:hover, &.actived {
	background-position: -112px -122px;
  }
}

.menu-item3 {
  background-position: -215px 0;
  &:hover, &.actived {
	background-position: -215px -122px;
  }
}

.menu-item4 {
  background-position: -319px 0;
  &:hover, &.actived {
	background-position: -319px -122px;
  }
}

.menu-item5 {
  background-position: -422px 0;
  &:hover, &.actived {
	background-position: -422px -122px;
  }
}

.menu-item6 {
  background-position: -525px 0;
  &:hover, &.actived {
	background-position: -525px -122px;
  }
}

.menu-item7 {
  background-position: -628px 0;
  &:hover, &.actived {
	background-position: -628px -122px;
  }
}
